<template>
  <view>
    <BaseNavbar :title="title" />

    <BaseSearch placeholder="请输入用户账号" @search="search" />

    <ComList :loading-type="loadingType">
      <UserListCard
        v-for="item in listData"
        :key="item.id"
        :info="item"
        @setDivide="popShow(item, 'setDivide')"
        @enableUser="popShow(item, 'enableUser')"
        @bindWx="popShow(item, 'bindWx')"
        @clickCrad="clickCrad(item)"
      />
    </ComList>
    <FixedAddIcon @onAdd="goAddUser" />
    <BaseModal
      :show.sync="isShowModal"
      @confirm="confirmModal"
      :content="modalContent"
    >
      <template v-if="isDivide">
        <view class="input-percentage" slot="default">
          <BaseInput
            v-model="percentage"
            placeholder="请输入比例数值"
            rightText="%"
          />
        </view>
      </template>
      <template v-if="isBindWx">
        <view v-if="isUnbindWx">确定解绑该用户的微信吗?</view>
        <view slot="default" v-else>
          1、关注“{{ vSiteConfig.site_info.site_name }}”公众号
          <br />
          2、登录“{{ vSiteConfig.site_info.site_name }}云平台”
          <br />
          3、绑定微信号
        </view>
      </template>
    </BaseModal>
  </view>
</template>

<script>
import BaseNavbar from "@//components/base/BaseNavbar.vue";
import BaseSearch from "@//components/base/BaseSearch.vue";
import myPull from "@/mixins/myPull.js";
import ComList from "@//components/list/ComList.vue";
import UserListCard from "../components/cards/UserListCard.vue";
import FixedAddIcon from "@//components/common/FixedAddIcon.vue";
import BaseModal from "@//components/base/BaseModal.vue";
import BaseInput from "@//components/base/BaseInput.vue";
export default {
  components: {
    BaseNavbar,
    BaseSearch,
    ComList,
    UserListCard,
    FixedAddIcon,
    BaseModal,
    BaseInput,
  },
  data() {
    return {
      title: "用户管理",
      isShowModal: false,
      isDivide: false,
      isEnableUser: false,
      isBindWx: false,
      percentage: "", //设置分成
      searchValue: "", //搜索框value
      modalContent: "是否禁用该用户？",
      selectItem: {},
      isUnbindWx: false, //是否是解绑微信
    };
  },
  methods: {
    goAddUser() {
      uni.navigateTo({ url: "/pagesB/user/UserAdd?from=add" });
    },

    //确认设置分成
    setDivide() {
      let data = {
        role_id: this.selectItem.role_id,
        per_user_id: this.selectItem.id,
        per: this.percentage,
      };
      this.$u.api.divideMoney(data).then((res) => {
        this.isShowSuccess("设置成功", 0, () => this.refresh());
      });
      this.percentage = "";
      console.log("确认设置分成");
    },
    //确认 设置用户禁用和启用
    enableUser() {
      let data = {
        id: this.selectItem.id,
        user_status: this.selectItem.user_status == 1 ? 0 : 1,
      };
      this.$u.api.enableUser(data).then((res) => {
        this.isShowSuccess("设置成功", 0, () => this.refresh());
      });
    },
    //解绑微信
    unBindWx() {
      if (!this.isUnbindWx) return;
      let data = {
        id: this.selectItem.id,
      };
      this.$u.api.unBingWX(data).then((res) => {
        this.isShowSuccess("解绑成功", 0, () => this.refresh());
      });
    },
    getList(page, done) {
      let data = {
        page,
        user_login: this.searchValue,
      };
      this.$u.api.getMyUserList(data).then((res) => {
        done(res.data);
      });
    },
    search(val) {
      this.searchValue = val;
      this.refresh();
    },

    popShow(item, from) {
      this.selectItem = item;
      this.modalContent = "";

      if (from == "setDivide") {
        this.isDivide = true;

        this.isEnableUser = false;
        this.isBindWx = false;
      } else if (from == "enableUser") {
        this.modalContent =
          item.user_status == 1 ? "是否禁用该用户?" : "是否解禁该用户";
        this.isEnableUser = true;

        this.isDivide = false;
        this.isBindWx = false;
      } else if (from == "bindWx") {
        this.isUnbindWx = item?.openid ? true : false;
        this.isBindWx = true;

        this.isDivide = false;
        this.isEnableUser = false;
      }
      this.isShowModal = true;
    },
    confirmModal() {
      console.log();
      if (this.isDivide) {
        this.setDivide();
      } else if (this.isBindWx) {
        this.unBindWx();
      } else if (this.isEnableUser) {
        this.enableUser();
      }
    },
    clickCrad(item) {
      uni.navigateTo({ url: `/pagesB/user/UserAdd?from=edit&id=${item.id}` });
    },
  },
  onLoad(options) {
    this.refresh();
  },
  onShow() {
    let pages = getCurrentPages();
    let currPage = pages[pages.length - 1]; // 当前页
    if (currPage.data.isDoRefresh == true) {
      // 是否刷新
      currPage.data.isDoRefresh = false;
      this.refresh();
    }
  },
  mixins: [myPull()],
};
</script>

<style lang="scss">
page {
  background-color: $pageBgColor;
}
</style>

<style lang="scss" scoped>
</style>